/* eslint-disable @typescript-eslint/explicit-function-return-type */
/* eslint-disable @typescript-eslint/strict-boolean-expressions */
import React, { FC, Suspense } from 'react'
import routes from './Router_config'
import { Route, Routes, BrowserRouter, Navigate } from 'react-router-dom'
import { RouterList, RouterItem } from '../utils/index'
const Routerview: FC = () => {
  const readerRouter = (arr: RouterList) => {
    return arr.map((item: RouterItem, index: number) => {
      return (
        <Route
          key={index}
          path={item.path}
          element={item.to ? <Navigate to={item.to} /> : <item.element />}
        >
          {item.children && readerRouter(item.children)}
        </Route>
      )
    })
  }
  return (
    <BrowserRouter>
      <Suspense>
        <Routes>{readerRouter(routes)}</Routes>
      </Suspense>
    </BrowserRouter>
  )
}

export default Routerview
